<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<div class="row">
	<div class="span8">
		<ul class="thumbnails">
			<c:forEach items="${requestScope.users}" var="user">
				<li class="span4 clearfix">
					<div class="thumbnail clearfix">
						<img src="http://placehold.it/320x200" alt="ALT NAME"
							class="pull-left span2 clearfix" style='margin-right: 10px'>
						<div class="caption" class="pull-left">
							<h4>
								<a href="profile?id=${user.id}"><c:out value="${user.name}" /></a>
							</h4>
							<small><b>From: </b>${user.city}</small>
						</div>
					</div>
				</li>
			</c:forEach>
		</ul>
	</div>
	<div class="span4">
		<div class="well">
			<h4>Search for:</h4>

			<form method="get" action="search">
				<input type="text" name="name" placeholder="by name" /> <select
					name="astral_sign">
					<option value="">by astral sign</option>
					<option>Aries</option>
					<option>Taurus</option>
					<option>Gemini</option>
					<option>Cancer</option>
					<option>Leo</option>
					<option>Virgo</option>
					<option>Libra</option>
					<option>Scorpio</option>
					<option>Sagittarius</option>
					<option>Capricorn</option>
					<option>Aquarius</option>
					<option>Pisces</option>
				</select> <select name="sex">
					<option value="">by sex</option>
					<option value="f">female</option>
					<option value="m">male</option>
				</select> <input type="text" name="city" placeholder="by city" />
				<button type="submit" class="btn btn-primary">
					<i class="icon-search icon-white"></i> Search
				</button>
			</form>
		</div>
	</div>
</div>

